<template>
	<view class="">
		<h4>大小size</h4>
		<view class="list">
			<button size="large">large</button>
			<button size="normal">normal</button>
			<button size="small">small</button>
			<button size="mini">mini</button>
		</view>
		
		<h4>类型type</h4>
		<view class="list">
			<button type="primary" size="small">primary</button>
			<button type="success" size="small">success</button>
			<button type="warning" size="small">warning</button>
			<button type="danger" size="small">danger</button>
		</view>
		
		
		<h4>镂空 plain</h4>
		<view class="list">
			<button type="primary" size="small" plain>primary</button>
			<button type="success" size="small" plain>success</button>
			<button type="warning" size="small" plain>warning</button>
			<button type="danger" size="small" plain>danger</button>
		</view>
		
		
		<h4>状态</h4>
		<view class="list">
			<button loading>按钮 loading</button>
			<button disabled>按钮 disabled</button>
		</view>
		
	</view>
</template>

<script>
	export default {
		data(){
			return {
				
			}
		},
		methods:{
			
		}
	}
</script>
<style lang="scss" scoped>
	h4{
		padding:30rpx 20rpx;
	}
	
	.list{
		padding:0 20rpx;
		button+button{
			margin-left:10rpx;
		}
	}
</style>
<style lang="scss" scoped>
	
</style>